import React, { memo, useEffect } from "react";
import { useDispatch, useSelector, shallowEqual } from "react-redux";

import Title from "@/components/theme-header-rcm";
import { RankingWrapper } from "./style";

import { getListAction } from "../../store/actionCreatorgs";

const Unit = memo(function () {
  const dispatch = useDispatch();
  useEffect(() => {
    dispatch(getListAction(0));
    dispatch(getListAction(2));
    dispatch(getListAction(3));
  }, [dispatch]);
  const {
    toplist = [],
    newList = [],
    originlist = [],
  } = useSelector(
    (state) => ({
      toplist: state.getIn(["recommend", "toplist"]),
      newList: state.getIn(["recommend", "newList"]),
      originlist: state.getIn(["recommend", "originlist"]),
    }),
    shallowEqual
  );
  console.log(toplist, newList, originlist);
  return (
    <RankingWrapper>
      <Title title="榜单" />
      <div className="tops"></div>
    </RankingWrapper>
  );
});
export default Unit;
